{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="body"}
<style>
    .count_row{
        display: flex;
        justify-content: flex-end;
        flex-direction: row;
        align-content: center;
        align-items: center;
    }
    .row_item{
        display: flex;
        flex-direction: row;
        align-content: center;
        justify-content: flex-start;
        align-items: center;
        margin: 0 10px;
    }
</style>
<div class="layui-col-lg12 layui-col-md12 layui-col-sm12">

    <div class="">
        <form class="layui-form gg-form-bar border-t border-x">

<!--            <div class="layui-input-inline" style="width:300px;">-->
<!--                <input type="text" name="pCode" placeholder="供应商编码" class="layui-input" autocomplete="off" />-->
<!--            </div>-->
            <div class="layui-input-inline" style="width:300px;">
                <input type="text" name="pName" placeholder="供应商名称" class="layui-input" autocomplete="off" />
            </div>
            <div class="layui-input-inline" style="width:300px;">
                <input type="text" name="bar_code" placeholder="产品编码" class="layui-input" autocomplete="off" />
            </div>
            <div class="layui-input-inline" style="width:300px;">
                <input type="text" name="mdName" placeholder="产品名称" class="layui-input" autocomplete="off" />
            </div>
            <div class="layui-input-inline" style="width:300px;">
                <input type="text" id="orderDate" readonly name="orderDate" placeholder="单据时间" class="layui-input" autocomplete="off" />
            </div>

            <div class="layui-input-inline" style="width:150px;">
                <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webformIndex"><i class="layui-icon layui-icon-search mr-1"></i>搜索</button>
            </div>
        </form>
        <div class="p-3">
            <div>

                <table class="layui-hide" id="treeTable" lay-filter="treeTable"></table>
            </div>
        </div>
    </div>
</div>

<script type="text/html" id="toolbarDemo">
    <!--    <div class="layui-btn-container">-->
    <!--        <a class="layui-btn layui-btn-sm"  lay-event="fh"  type="button">批量复核</a>-->
    <!--          	<a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="cx"  type="button">批量撤销</a>-->
    <!--    </div>-->
</script>
<script type="text/html" id="actionBar">

</script>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
    const moduleInit = ['tool'];
    var mStatus=['','草稿','已确认'];
    function gouguInit() {
        var treeTable = layui.treeTable, tool = layui.tool,form = layui.form,laydate=layui.laydate;
        var upload=layui.upload;
        var tableIns = treeTable.render({
            elem: '#treeTable'
            , url: "{:url('index')}"
            ,toolbar: '#toolbarDemo',
            defaultToolbar:  ['filter',  'exports']
            , tree: { // treeTable 特定属性集
                customName: {name: 'name'},
                data: {},
                view: {showIcon: false},
                async: {},
                callback: {}
            }
            , cellMinWidth: 80
            , cols: [[
                // {type: 'checkbox', fixed: 'left' },
                // {fixed: 'left',field: 'id',title: 'ID' ,unresize: true,hide:true},
                // {field: 'pCode',  title: '供应商编码'},
                {field: 'pName',  title: '供应商名称'},
                {field: 'bar_code',  title: '产品编码'}
                , {field: 'mdName',  title: '产品名称'}
                , {field: 'specs',  title: '规格型号'}
                , {field: 'unit',  title: '单位'}
                , {field: 'saleNum',  title: '采购数量'}

            ]]
            , page: true
            ,parseData:function (res) {

            }
        });
        //监听搜索提交
        form.on('submit(webformIndex)', function (data) {
            tableIns.reload({
                where: data.field,
                page: {
                    curr: 1
                }
            });
            return false;
        });
        //表头工具栏事件

        table.on('toolbar(treeTable)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            console.log(checkStatus)
            switch(obj.event){
                case 'fh':
                    var data = checkStatus.data;
                    var ids=[]
                    if (data.length){
                        data.forEach(function (value,index) {
                            ids.push(value.id)
                        })
                        let callback = function (e) {
                            layer.msg(e.msg);
                            if (e.code == 0) {
                                tableIns.reload();
                            }
                        }
                        tool.post("{:url('doCheck')}", {id: ids.join(',')}, callback);
                    }else {
                        layer.msg('请选择数据');
                    }
                    break;
                case 'cx':
                    var data = checkStatus.data;
                    var ids=[]
                    if (data.length){
                        data.forEach(function (value,index) {
                            ids.push(value.id)
                        })
                        let callback = function (e) {
                            layer.msg(e.msg);
                            if (e.code == 0) {
                                tableIns.reload();
                            }
                        }
                        tool.post("{:url('doCancel')}", {id: ids.join(',')}, callback);


                    }else {
                        layer.msg('请选择数据');
                    }

                    break;

            };
        })

        laydate.render({
            elem: '#orderDate'
            ,type:'date'
            ,range:'~'
        });
    }



</script>
{/block}
<!-- /脚本 -->